@extends('wx.layout.default')

@section('wx.pheader')
  @include('wx.layout.swiper')
@stop

@section('wx.pbody')
  <div class="weui-panel weui-panel_access">
    <div class="weui-panel__hd">借阅记录</div>
    <div class="weui-panel__bd">
        @foreach ($borrows as $borrow)
        <div class="weui-media-box weui-media-box_text">
            <div class="book-image">
              <img class="lazy img-error1" src="/assets/images/blank.gif" data-original="/assets/images/books/{{$borrow->book->dbid}}.jpg" />
            </div>
            <h4 class="weui-media-box__title"><span class="smaller-80">{!! $borrow->book->present()->bookStore !!}</span> {{ $borrow->book->title }}</h4>            
            <p class="weui-media-box__desc">{{ $borrow->book->summary }}</p>
            <ul class="weui-media-box__info">
                <li class="weui-media-box__info__meta">{{ $borrow->book->author }}</li>
                <li class="weui-media-box__info__meta weui-media-box__info__meta_extra">{{ $borrow->book->publisher }}</li>
            </ul>
            <ul class="weui-media-box__info" style="margin-top:0;">
                <li class="weui-media-box__info__meta">ISBN: {{ $borrow->book->isbn }}</li>
                <li class="weui-media-box__info__meta">借阅日期： {{date('Y-m-d',$borrow->date_begin)}}</li>
                <li class="weui-media-box__info__meta weui-media-box__info__meta_extra">{!! $borrow->present()->BorrowStatus !!}</li>
            </ul>
        </div>
        @endforeach
    </div>
  </div>

@stop

@section('javascript')
  <script src="//cdn.bootcss.com/jquery-weui/1.2.1/js/swiper.min.js"></script>
  <script src="//cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.min.js"></script>
  <script src="//cdn.bootcss.com/jquery_lazyload/1.9.7/jquery.lazyload.min.js"></script>
  <script type="text/javascript">
    $(function() {

      $('.swiper-container').swiper({
        loop: true,
        autoplay: 5000,
        pagination: '.swiper-pagination',
        paginationClickable: true
      });

      $(".lazy").lazyload({
          effect : "fadeIn"
        });

    });
  </script>
@stop